<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<%@ include file="/WEB-INF/views/include/head.jsp"%>

<!DOCTYPE html>
<html>
<head>
	<title>${article.title} - ${category.name}</title>
	<%-- <meta name="decorator" content="cms_default_${site.theme}"/> --%>
	<script src="${ctxStatic}/jquery-mobile/jquery-mobile-image-silder/js/plugins/islider_desktop.js" type="text/javascript"></script>
	<script src="${ctxStatic}/jquery-mobile/jquery-mobile-image-silder/js/islider.js"></script>
	<link href="${ctxStatic}/jquery-mobile/test_islider/islider.css" rel="stylesheet">
    <style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        #iSlider {
            position: absolute;
            width: 100%;
            height:62.5%;
            overflow: hidden;
        }
    </style>
</head>
<body>
	   
<div id="iSlider"></div>
	     
	     
<script type="text/javascript">
		var list = [
            {
                'content': '<div><a href="#"><img style="width:100%;height:100%;position:absolute" alt="" src="imgs/1.jpg"></a></div>'
            },
            {
                'content': '<div><a href="#"><img style="width:100%;height:100%;position:absolute" alt="" src="imgs/2.jpg"></a></div>'
            }, {
                'content': '<div><a href="#"><img style="width:100%;height:100%;position:absolute" alt="" src="imgs/3.jpg"></a></div>'
            }];
        var islider = new iSlider({
            data: list,
            type: 'dom',
            dom: document.getElementById("iSlider"),
            duration: 1000,
            isLooping: true,
            isAutoPlay: true,
            fixPage: true
        });
        islider.addDot();
</script>	     
</body>
</html>